<!DOCTYPE html>
<html>
    <head>
        <title>lehe 翻译</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!-- 新 Bootstrap 核心 CSS 文件 -->
        <link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
        <link href="/static/bootstrap-icons-1.9.1/fonts/bootstrap-icons.woff" rel="stylesheet">
        <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
        <script type="text/javascript" src="/static/jquery-3.6.0.min.js"></script>
        <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
        <script type="text/javascript" src="/static/bootstrap/js/bootstrap.min.js"></script>
        <!-- HTML5 Shiv 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
        <!-- 注意： 如果通过 file://  引入 Respond.js 文件，则该文件无法起效果 -->
        <!--[if lt IE 9]>

       <![endif]-->
    </head>
    <body style="background-color:darkslategray;">
        <div id="top-navbar">
            <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
                <div class="container-fluid">
                    <a class="navbar-brand" href="#">
                        <!--<img class="" src="static/image/logo-transparency-60px.png" alt="logo" width="90%" height="90%">-->
                        <img class="rounded-circle img-thumbnail" src="static/image/logo.jpg" alt="logo" width="55%" height="55%">
                    </a>
                    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#daohangcaidan" aria-controls="daohangcaidan" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
                    <div id="daohangcaidan" class="collapse navbar-collapse">
                        <ul class="navbar-nav">
                            <li class="nav-item">
                                <a class="nav-link active" aria-current="page" href="/">翻译</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" target="_blank" href="/knowledge">知道</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" target="_blank" href="/tablink">tablink</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" target="_blank" href="/blog">blog</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" target="_blank" href="https://getbootstrap.com/docs/5.2/getting-started/introduction/">bootstrap</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" target="_blank" href="https://docs.djangoproject.com/en/4.1/">django</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </nav>
            <nav id="myTab1" class="nav nav-tabs navbar-light bg-light" role="tablist">
                <li class="nav-item" role="presentation">
                  <button id="translation" class="nav-link text-muted active" aria-controls="contentTranslation" role="tab" data-bs-toggle="tab" data-bs-target="#contentTranslation" aria-selected="true">翻译句子</button>
                </li>
                <li class="nav-item" role="presentation">
                  <button id="Instruction" class="nav-link text-muted" aria-controls="contentInstruction" role="tab" data-bs-toggle="tab" data-bs-target="#contentInstruction" aria-selected="false">使用说明</button>
                </li>
            </nav>
        </div>
        <div class="tab-content">
            <img src="/static/bootstrap-icons-1.9.1/cloud-drizzle.svg"  width="64" height="64"/>
            <div id="contentTranslation" class="tab-pane fade show active" role="tabpanel" aria-labelledby="translation" tabindex="0">{% include 'translation.html'%}</div>
            <div id="contentInstruction" class="tab-pane fade" role="tabpanel" aria-labelledby="Instruction" tabindex="0">{% include 'instruction.html'%}</div>
        </div>
        <script type="text/javascript">


        </script>

    </body>
</html>
